import { makeObservable, observable, action, computed } from "mobx";
import Hero, { HeroInfo } from "../assets/hero";
import HeroKey from "../assets/hero.key";

export class Store {
  site: {
    x: number;
    y: number;
  } = {
    x: 0,
    y: 0,
  };

  hero: HeroInfo = Hero["New Jersey"];

  fps: number = 30;
  joyStick = {
    x: 0,
    y: 0,
    radius: 60,
    isDragging: false,
    dragglable: false,
  };

  constructor() {
    makeObservable(this, {
      joyStick: observable,
      site: observable,
      hero: observable,
      fps: observable,
      setSite: action,
      setHero: action,
      setFps: action,
      speedX: computed,
      speedY: computed,
    });
  }

  setSite(site: Store["site"]) {
    this.site = site;
  }

  setHero(hero: HeroKey) {
    this.hero = Hero[hero];
  }

  setFps(fps: number) {
    this.fps = fps;
  }

  get speedX(): number {
    return (
      (((((10 * 30) / this.fps) * this.hero.speed) / 100) *
        Math.abs(this.joyStick.x)) /
      60
    );
  }

  get speedY(): number {
    return (
      (((((10 * 30) / this.fps) * this.hero.speed) / 100) *
        Math.abs(this.joyStick.y)) /
      60
    );
  }
}
